<template>
    
    <a-form ref="formRef" :model="value"  :rules="rules" :labelCol="{ style: { width: '100px' } }" >
        <a-row :gutter="[24, 24]">

            <a-col :span="24">
                <a-form-item label="名称" name="name" required>
                    <a-input v-model:value="value.name" placeholder="请输入类别名称" allowClear />
                </a-form-item>
            </a-col>

             
        </a-row>
    </a-form>


</template>
<script setup lang="ts">
import type { Category } from '@/types/Category';
import { ref } from 'vue';

import uploadImg from '@/components/uploadImg.vue'

import { useTabStore } from '@/stores/tab'


import { useCategoryStore } from '@/stores/category'

import type { Rule } from 'ant-design-vue/es/form';
import AreaInput from '@/components/areaInput.vue';

const categoryStore = useCategoryStore()
const tabStore = useTabStore()
const value = defineModel<Category>('value', { default: {} })
const formRef = ref()

const rules: Record<string, Rule[]> = {
   

};

const validate = async () => {
    await formRef.value.validate();
};
const resetFields = () => {
    formRef.value.resetFields();
};
defineExpose({
    validate,
    resetFields,
});
</script>
<style scoped></style>